<template>
	<gui-page ref="guiPage" :customHeader="true">
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left" @clickLeftBack="clickLeftBack" :title="$t('mexico.trayCalibrate')"
				@clickRight="clickRight" scanType="0"></nav-bar-custom>
		</template>
		<template v-slot:gBody>
			<view class="barcodeSplitting" :style="'height: calc(100vh - ' + navHeight + 'px);'">
				<!-- 扫描模块 -->
				<view class="custom-form-card">
					<view class="custom-card-title">
						<text class="title-line"></text>
						{{ $t('Common.scanTrayBarcode') }}
					</view>
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text
								class="required-color">*</text>{{ $t('translationImage.process') }}：</text>
						<comboGrid ref="comboGridRef" v-model="data.process" :requestParam="data.requestParam"
							requestUrl="/api1/iot/open/GetDicDataPda" :calculate='false'
							:placeholder="$t('distributedEnter.placeholderTextChoose')" inputKey="code"
							:column="data.columnRule.column" bindValue="locationName" @setClick="getRuleClick">
						</comboGrid>
					</view>
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text
								class="required-color">*</text>{{ $t('multilingual.productionLine') }}：</text>
						<comboGrid ref="comboGridRef" v-model="data.productionLine" :requestParam="data.requestParam2"
							requestUrl="/api1/iot/open/GetDicDataPda" :calculate='false'
							:placeholder="$t('distributedEnter.placeholderTextChoose')" inputKey="code"
							:column="data.columnRule2.column" bindValue="locationName" @setClick="getRuleClick2">
						</comboGrid>
					</view>
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text class="required-color">*</text>{{
							$t('mexico.position')}}：</text>
						<comboGrid ref="comboGridRef" v-model="data.position" :requestParam="data.requestParam3"
							requestUrl="/api1/iot/open/GetDicDataPda" :calculate='false'
							:placeholder="$t('distributedEnter.placeholderTextChoose')" inputKey="code"
							:column="data.columnRule3.column" bindValue="locationName" @setClick="getRuleClick3">
						</comboGrid>
					</view>
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text class="required-color">*</text>{{ $t('mexico.emptyPallets')
							}}：</text>
						<uni-easyinput class="uni-mt-5" type="number" v-model="data.palletQty"
							:placeholder="$t('hardwareOut.pleaseQty')">
						</uni-easyinput>
					</view>
					
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text class=""></text>{{ $t('物料代码')
							}}：</text>
						<uni-easyinput class="uni-mt-5" v-model="data.materialCode"
							:placeholder="$t('物料代码')"  :disabled="false">
						</uni-easyinput>
					</view>
					
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text ></text>{{ $t('物料名称')
							}}：</text>
						<uni-easyinput class="uni-mt-5" v-model="data.materialName"
							:placeholder="$t('物料名称')" :disabled="false">
						</uni-easyinput>
					</view>
					
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text ></text>{{ $t('托盘号')
							}}：</text>
						<uni-easyinput class="uni-mt-5" v-model="data.carton"
							:placeholder="$t('托盘号')">
						</uni-easyinput>
					</view>
					<view class="custom-card-itemTwo" style="padding: 10rpx 0;">
						<text class="item-info-title"><text
								class="required-color">*</text>{{ $t('mexico.emptyPalletsType') }}：</text>
						<view class="gui-form-body gui-text-right" style="overflow: visible;">
							<superweiCombox style="text-align: right;" :candidates="data.selectList"
								:placeholder="$t('distributedEnter.placeholderTextChoose')" :isJSON="true"
								keyName="name" @select="select" v-model="data.palletType">
							</superweiCombox>
						</view>
					</view>
				</view>
				
				
				
			
				
				<!-- 底部按钮 -->
				<view class="page-bottom-box">
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="handelCommit">{{ $t('calendar.submit')
						}}
					</view>
				</view>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
import { navigate } from '@/utils/routerSkip.js';
import { useStore } from "vuex";
import { getDicDataPda, modifyEmptyLocationQty } from '@/api/api.js';
import { basPdaOperationLogFn } from '@/utils/index.js';
import pdaScan from '@/hooks/pdaScan.js';
import storageBin from '@/components/storageBin.vue'
import comboGrid from '@/components/comboGrid.vue'
import superweiCombox from '@/components/superweiCombox';
import { onBackPress } from '@dcloudio/uni-app';
import { USERINFO, OPERATION_COMMIT, OPERATION_LOOK, OPERATION_SCAN } from '@/constant/index.js'
import { ref, reactive, onMounted, watch, computed, toRaw } from 'vue';
//JS国际化引入
import { useI18n } from 'vue-i18n';

components: {
	storageBin,
		comboGrid,
		superweiCombox
}

const { scan } = pdaScan();
const { t } = useI18n();
let store = useStore();

const navHeight = computed(() => {
	return store.state.navHeight
})

const data = reactive({
	tippper: false,//扫描铁托盘的状态
	process: '', //工序
	processName: '',//点位名称
	productionLine: '',//产线
	productionLineName: '',//点位名称
	position: '', // 点位
	positionName: '',//点位名称
	isfocus: false,
	isfocusM: false,
	value: ['0'],
	scanwoodenList: [], // 木托盘list
	barcodeList: [],
	ipperLsit: '',
	inputType: 'tcode',  //扫描类型
	palletType: '', // 托盘类型
	selectId: '',//托盘id
	materialCode:'',  //物料代码
	materialName:'', //物料名称
	carton:'', //托盘号
	
	selectList: [{
		id: 'SteelCarton60',
		name: t('mexico.largeTray')
	}, {
		id: 'SteelCarton48',
		name: t('mexico.smallTray')
	}],
	palletQty: null, // 空托盘数量
	requestParam: {
		type: '1',
		parentCode: ''
	},
	requestParam2: {
		type: '2',
		parentCode: ''
	},
	requestParam3: {
		type: '3',
		parentCode: ''
	},
	columnRule: {
		column: [{
			label: t('translationImage.process'),
			name: "text",
		}, {
			label: 'code',
			name: "code",
		}]
	},
	columnRule2: {
		column: [{
			label: t('newTranslation.productionLineCode'),
			name: "text",
		}, {
			label: t('newTranslation.productionLineName'),
			name: "code",
		}]
	},
	columnRule3: {
		column: [{
			label: t('Common.pointPositionCode'),
			name: "text",
		}, {
			label: t('Common.pointPositionName'),
			name: "code",
		}]
	},
})

onMounted(() => {
	uni.$on('scancodedate', (data) => {
		console.log('获取到的code：' + data.code)
		getCode(data.code, 'pda')
	})
	getDicDataPda({
		type: '2',
		parentCode: 'JC'
	}).then(res => {

	})
})

watch(
  () =>data.palletQty, // 只监听 name 属性
  (newdata) => {
    if(newdata==0){
		data.palletType=''
	}
  }
)

// 将数据存储在vuex
data.scanwoodenList = computed(() => {
	return store.state.trayCalibrate
})

// 工序选择
const getRuleClick = (e) => {
	data.process = e.code
	data.requestParam2.parentCode = e.code
	data.processName = e.text
	data.productionLine = ''
	data.position = ''
}

// 产线选择
const getRuleClick2 = (e) => {
	data.productionLine = e.code
	data.requestParam3.parentCode = e.code
	data.productionLineName = e.text
}
// 位置选择
const getRuleClick3 = (e) => {
	data.position = e.code
	data.positionName = e.text
	data.palletQty=e.qty
	data.palletType=e.cartonType
	data.materialCode=e.materialCode
	data.materialName=e.materialName
	data.carton=e.barCode
}

// 托盤類型的选择事件
const select = (e) => {
	console.log(e)
	data.selectId = e.id;
}
//  提交
const handelCommit = () => {
	if (!data.process) {
		uni.showToast({ title: t('JsInternational.chooseOperation'), icon: 'none' });
		return
	}
	if (!data.productionLine) {
		uni.showToast({ title: t('JsInternational.chooseLine'), icon: 'none' });
		return
	}
	if (!data.position) {
		uni.showToast({ title: t('mexico.aPointPosition'), icon: 'none' });
		return
	}
	if (!data.palletQty || Number(data.palletQty) < 0) {
		uni.showToast({ title: t('hardwareOut.pleaseQty'), icon: 'none' });
		return
	}
		
	if(data.palletQty>0){
		if (!data.palletType) {
			uni.showToast({ title: t('mexico.bandeja'), icon: 'none' });
			return
		}
	}
	
	//接口参数获取
	let parmes = {
		processCode: data.process,
		lineCode: data.productionLine,
		locationCode: data.position,
		cartonType: data.selectId,
		qty: data.palletQty,
		carton:data.carton,
		materialCode:data.materialCode,
		materialName:data.materialName
	}
	// 添加加载框
	uni.showLoading({
		title: 'loading',
		mask: true
	});
	// 接口
	modifyEmptyLocationQty(parmes).then(res => {
		try {
			let inputParameter = JSON.stringify(parmes)
			let returnParameter = JSON.stringify(res)
			let operationPicture = '托盘校准'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.message,//错误信息
				isPass: res.code == 200 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_COMMIT,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 200) {
			//隐藏加载框
			uni.hideLoading();
			uni.showToast({ title: t('smashRemoval.submitSuccessfully'), icon: 'none' });
			// 提交成功清空数据
			store.commit("clearPalletTrayList");//提交成功清空vuex中的数据，同时领料数量也会自动清空
			data.process = ""
			data.productionLine = ""
			data.position = ""
			data.palletType = ''
			data.palletQty = null,
			data.materialCode='',
			data.materialName='',
			data.carton=''
			// data.scanwoodenList.length = 0
		} else {
			uni.showToast({ title: res.message, icon: "none" });
		}
	})
}

// 扫描纪录
const clickRight = () => {
	navigate({
		url: '/pages/barcodeManagement/trayCalibrateRecord'
	})
}

//导航栏左侧返回
const clickLeftBack = () => {
	if (!data.scanwoodenList.length) {
		uni.navigateBack({
			delta: 1
		});
		return
	}
	uni.showModal({
		title: t('smashRemoval.warmPrompt'),
		content: t('materials.unsubmittedDataIn'),
		success: function (res) {
			if (res.confirm) {
				store.commit('clearPalletTrayList', data.scanwoodenList)  // 返回清空扫描数据
				uni.navigateBack({
					delta: 1
				});
			} else if (res.cancel) {
				console.log('用户点击取消');
			}
		}
	});
}

//点击物理按键的返回
onBackPress((options) => {
	if (options.from == 'backbutton') {
		if (!data.scanwoodenList.length) {
			uni.navigateBack({
				delta: 1
			});
			return true
		}
		uni.showModal({
			title: t('smashRemoval.warmPrompt'),
			content: t('materials.unsubmittedDataIn'),
			success: function (res) {
				if (res.confirm) {
					//清除store 里面的数据
					store.commit("clearPalletTrayList");
					uni.navigateBack({
						delta: 1
					});
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
		return true;
	}
})

</script>


<style lang="scss" scoped>
.barcodeSplitting {
	display: flex;
	flex-direction: column;
	height: calc(100vh - 88rpx);
}

.distributed-head {
	border-bottom-left-radius: 16rpx;
	border-bottom-right-radius: 16rpx;
}

.scroll {
	flex: 1;
	height: 2rpx;
}

.page-bottom-box {
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
}
</style>